<template>
	<view class="regis">
		<view class="top">
			<view class="top1">
				注册
			</view>
		</view>
		<view class="content">
			<view class="content1">
				<image src="../../static/login/图片5.png" mode=""></image>
				<input type="number" @blur="phoneIsReg()" v-model="phone" placeholder="手机号" />
			</view>
			<view class="content2">
				<image src="../../static/login/图片8.png" mode=""></image>
				<input type="text" v-model="code" placeholder="手机验证码" />
				<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view>
			</view>
			<view class="content1">
				<image src="../../static/login/图片9.png" mode=""></image>
				<input type="text" v-model="password" placeholder="密码" />
			</view>
			<view class="content1">
				<image src="../../static/login/图片9.png" mode=""></image>
				<input type="text" v-model="password1" placeholder="确认密码" />
			</view>
			<view class="content1">
				<input type="text" v-model="Invitation" placeholder="请输入邀请码"
					style="text-align: center; width: 90%; margin: 0 auto;" />
			</view>
		</view>
		<view class="bottom" @click="btn()">
			马上注册
		</view>
		<view class="bott" @click="rout()">
			已经有账号？马上登录
		</view>
	</view>
</template>

<script>
	// import * as api from '../../common/http.api.js'
	var _this, js;
	export default {
		data() {
			return {
				phone: "",
				code: '',
				password: '',
				password1: '',
				Invitation: '',
				second: 0
			}
		},
		//点击验证码
		computed: {
			yanzhengma() {
				if (this.second == 0) {
					return '获取验证码';
				} else {
					if (this.second < 10) {
						return '重新获取0' + this.second;
					} else {
						return '重新获取' + this.second;
					}
				}
			}
		},
		onLoad() {
			_this = this;
		},
		methods: {
			//获取验证码
			getcode() {
				if (this.phone.length != 11) {
					uni.showToast({
						icon: 'none',
						title: '手机号不正确'
					});
					return;
				}
				if (this.second > 0) {
					return;
				}
				this.second = 60;
				//请求业务
				js = setInterval(function() {
					_this.second--;
					if (_this.second == 0) {
						_this.clear()
					}
				}, 1000)
				uni.request({
					url: 'http://192.168.1.47:9110/p/sms/send',
					method: 'POST',
					data: {
						mobile: this.phone,
					},
				}).then(res => {
					console.log(res);
				})
			},
			//
			clear() {
				clearInterval(js)
				js = null
				this.second = 0
			},
			//判断电话号码是否已经注册
			phoneIsReg() {
				var that = this;

			},
			//登录
			rout() {
				uni.navigateTo({
					url: '../index/index'
				})
			},
			btn() {
				// if (this.phone.length != 11) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '手机号格式不正确'
				// 	});
				// 	return;
				// }
				// if (this.password.length < 6) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '密码不得低于6位'
				// 	});
				// 	return;
				// }
				// if (this.password1.length < 6) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '密码不得低于6位'
				// 	});
				// 	return;
				// }
				// 	if (this.password1 == this.password) {
				// 		uni.showToast({
				// 			icon: 'none',
				// 			title: '两次密码不一致'
				// 		});
				// 		return;
				// 	}
				// if(this.code.length == ''){
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '请输入验证码'
				// 	});
				// 	return;
				// }
				// if (this.code.length < 6) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '验证码不正确'
				// 	});
				// 	return;
				// }
				// console.log(this.phone)
				let {
					phone,
					code,
					password,
					Invitation
				} = this
				this.$u.post('/user/register',{
					userMobile: phone || '1',
					password: password || '1',
					userCode: code,
					upp_Invitation: Invitation || '88888888'
				}).then(res =>{
					console.log(res)
					if(res == true){
						uni.showToast({
							icon: 'success',
							title: '注册成功'
						});
						
					}else{
						uni.showToast({
							icon: 'none',
							title: res
						});
						return;
					}
					
					// if(res.statusCode == 200){
						
					// }
					
				}) .catch((e) => {});
				// api.request({
				// 	url:'/user/register',
				// 	data:{
				// 		nickName:phone || '1',
				// 		password:password || '1',
				// 		userCode:code,
				// 		userName:Invitation ||'88888888'
				// 	},
				// 	method:'POST'
				// 	}).then(res =>{
				// 		console.log(res)
				// 	})
				// api.request({
				// 	url:'/user/register'
				// })
			}
		}
	}
</script>

<style lang="scss">
	.regis {
		width: 100%;
		height: 100%;

		.top {
			width: 100%;
			height: 268rpx;
			background: url(../../static/login/图片7.png)no-repeat;
			position: relative;

			.top1 {
				width: 112rpx;
				height: 80rpx;
				text-align: center;
				position: absolute;
				top: 80rpx;
				left: 320rpx;
				font-size: 56rpx;
				color: #E9B263;
			}
		}

		.content {
			width: 90%;
			margin-left: 5%;
			margin-top: 80rpx;

			.content1 {
				width: 574rpx;
				height: 96rpx;
				border: 2rpx solid #BBBBBB;
				border-radius: 50rpx;
				display: flex;
				margin-left: 50rpx;
				margin-bottom: 50rpx;

				image {
					width: 34rpx;
					height: 34rpx;
					margin-left: 30rpx;
					margin-top: 25rpx;
				}

				input {
					width: 60%;
					height: 80rpx;
					margin-left: 20rpx;
					margin-top: 4rpx;
				}

			}

			.content2 {
				width: 574rpx;
				height: 96rpx;
				border: 2rpx solid #BBBBBB;
				border-radius: 50rpx;
				display: flex;
				margin-left: 50rpx;
				margin-bottom: 50rpx;

				image {
					width: 34rpx;
					height: 34rpx;
					margin-left: 30rpx;
					margin-top: 25rpx;
				}

				input {
					width: 60%;
					height: 80rpx;
					margin-left: 20rpx;
					margin-top: 4rpx;
				}

				text {
					width: 160rpx;
					height: 40rpx;
					color: #DCCB59;
					margin-right: 30rpx;
					margin-top: 30rpx;
					color: 28rpx;
				}

				view {
					width: 180rpx;
					height: 40rpx;
					color: #DCCB59;
					margin-right: 30rpx;
					margin-top: 30rpx;
					color: 28rpx;
				}
			}
		}

		.bottom {
			width: 574rpx;
			height: 96rpx;
			border: 2rpx solid #BBBBBB;
			border-radius: 50rpx;
			font-size: 52rpx;
			margin-left: 100rpx;
			margin-bottom: 50rpx;
			text-align: center;
			line-height: 96rpx;
			color: #FFFFFF;
			background: #DCCB59;
		}

		.bott {
			text-align: center;
			color: #E9B263;
		}
	}

	.yzms {
		color: #999999 !important;
		border: 1rpx solid #999999;
	}
</style>
